<template>
  <a-result
      status="success"
    :isSuccess="true"
    :content="false"
    :title="username"
    :sub-title="description">
    <template #extra>
      <a-col :span="8" :offset="8" style="margin-bottom: 20px">
        <a-input v-model="activeCode" placeholder="请输入邮件激活码"/>
      </a-col>
      <a-col :span="8" :offset="8">
        <a-button type="primary" @click="activeAccount">激活账号</a-button>
        <a-button style="margin-left: 10px" @click="goHomeHandle">返回登录页</a-button>
      </a-col>
    </template>

  </a-result>
</template>

<script>
import {activeAccount} from "@/api/user";

export default {
  name: 'RegisterResult',
  data () {
    return {
      description: '激活邮件已发送到你的邮箱中，邮件有效期为24小时。请及时登录邮箱，点击邮件中的链接激活帐户。',
      form: {},
      activeCode:''
    }
  },
  computed: {
    username () {
      const v = this.form && this.form.username || ''
      return this.form.username ? `你的账户：${v} 注册成功` : `请在下方文本框输入激活码`
    }
  },
  created () {
    this.form = this.$route.params
  },
  methods: {
    // 返回首页
    goHomeHandle () {
      this.$router.push({ name: 'login' })
    },
    // 激活账号
    async activeAccount(){
      const { activeCode } = this;
      if (activeCode.length === 0){
        this.$message.warn("请输入激活码");
        return;
      } else {
        const {code,msg} = await activeAccount(activeCode);
        if (code === 200){
          this.$message.success(msg);
          this.$router.push({ name: 'login' })
        } else if(code === 2008){
          this.$message.warn(msg);
        } else{
          this.$message.error(msg);
        }
      }
    }
  }
}
</script>

<style scoped>

</style>
